<template>
	<view class="page-wraper">
		<!-- 这里是选择的内容 -->
		<view class="selected-header-box">
			<scroll-view :scroll-x="true" class="scroll-view-class">
				<block v-for="(indexItem,index) in selectedDataList" :key="index">
					<view class="header_item_box" @click="moveClick(indexItem,index)">
						<text class="header-selected-view-class">{{indexItem.name}}</text>
						<image src="@/static/x.png" class="header-item-image"></image>
					</view>
				</block>
			</scroll-view>
		</view>

		<view class="more-view-box">
			<view class="more-view-left" :style="'height:' + scrollHeight+'px;'">
				<view class="left-item-box" @click="selectedClick(1)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==1"></image>
					</view>
					<view :class="temp==1?'left-item-text-selected':'left-item-text'">级别</view>
				</view>
				<view class="left-item-box" @click="selectedClick(2)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==2"></image>
					</view>
					<view :class="temp==2?'left-item-text-selected':'left-item-text'">所在地</view>
				</view>
				<view class="left-item-box" @click="selectedClick(3)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==3"></image>
					</view>
					<view :class="temp==3?'left-item-text-selected':'left-item-text'">上牌地</view>
				</view>
				<view class="left-item-box" @click="selectedClick(4)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==4"></image>
					</view>
					<view :class="temp==4?'left-item-text-selected':'left-item-text'">里程</view>
				</view>
				<!-- <view class="left-item-box" @click="selectedClick(5)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==5"></image>
					</view>
					<view :class="temp==5?'left-item-text-selected':'left-item-text'">车身机构</view>
				</view> -->
				<view class="left-item-box" @click="selectedClick(6)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==6"></image>
					</view>
					<view :class="temp==6?'left-item-text-selected':'left-item-text'">排放标准</view>
				</view>
				<view class="left-item-box" @click="selectedClick(7)">
					<view class="left-item-image">
						<image class="left-iamge-round" src="@/static/round.png" v-if="temp==7"></image>
					</view>
					<view :class="temp==7?'left-item-text-selected':'left-item-text'">燃油类型</view>
				</view>
			</view>
			<view class="more-view-right">
				<scroll-view scroll-y="true" :style="'height:' + scrollHeight+'px;'" :scroll-into-view="toview"
					@scroll="scrollLeftMore">
					<view class="more-view-right-title" id='idto1'>级别</view>
					<sortCar :data="levelDataList" :name="levelName" @sortItemtap='sortItemtap1' :lineNum='3'
						:sortCarShowList='true' v-if="isLevelShow" />
					<view class="more-view-right-title" id='idto2'>所在地</view>
					<sortCar :data="location1DataList" :name="location1Name" @sortItemtap='sortItemtap2' :lineNum='1'
						:sortCarShowList='true' v-if="islocation1Show" />
					<view class="more-view-right-title" id='idto3'>上牌地</view>
					<sortCar :data="location2DataList" :name="location2Name" @sortItemtap='sortItemtap3' :lineNum='1'
						:sortCarShowList='true' v-if="islocation2Show" />
					<view class="more-view-right-title" id='idto4'>里程</view>
					<sortCar :data="mileageDataList" :name="mileageName" @sortItemtap='sortItemtap4' :lineNum='2'
						:sortCarShowList='true' v-if="ismileageShow" />
					<!-- <slider-range :value="rangeValue" :min="rangeMin" :max="rangMax" :step="5" :bar-height="3"
						:block-size="26" background-color="#EEEEF6" active-color="#0B5AE9" :format="format"
						@change="handleRangeChange" :tipVisible='false'></slider-range> -->
					<view class="more-view-right-title" id='idto6'>排放标准</view>
					<sortCar :data="criterionDataList" :name="criterionName" @sortItemtap='sortItemtap5' :lineNum='3'
						:sortCarShowList='true' v-if="iscriterionhow" />
					<view class="more-view-right-title" id='idto7'>燃油类型</view>
					<sortCar :data="fuelDataList" :name="fuelName" @sortItemtap='sortItemtap6' :lineNum='3'
						:sortCarShowList='true' v-if="isfuelShow" />
					<view class="foot-view-class"></view>
				</scroll-view>
			</view>
		</view>

		<view class="foot-view-class"></view>
		<view class="foot-view" @click="foot_btnClick()">
			<button class="foot-view-btn">{{number}}辆车符合标准</button>
		</view>
		<uni-popup ref="popup" :animation="true" type="bottom" @maskClick="maskClickpopup()" @change="changePopup()"
			:maskBackgroundColor="'rgba(0, 0, 0, 0.7)'">
			<view class="popup-view-Recommend">
				<view class="popup_box">
					<view class="popup-title-box">
						<view class="popup-title-text">{{carPopupTitle}}</view>
						<image class="popup-image-close" src="@/static/Close-Circle.png" @click="closePopup()"></image>
					</view>
					<sortCar :data="carList" @sortItemtap='sortItemtap7' :lineNum='4' :sortCarShowList='true'
						v-if="isCarShow==0" />
					<sortCar :data="SUVList" @sortItemtap='sortItemtap8' :lineNum='4' :sortCarShowList='true'
						v-if="isCarShow==1" />
					<sortCar :data="MPVList" @sortItemtap='sortItemtap9' :lineNum='4' :sortCarShowList='true'
						v-if="isCarShow==2" />
					<view class="popup-btn-view">确定</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="select_ctiy_popup" :animation="true" type="bottom" @maskClick="maskClickpopup()"
			:safeArea="true" @change="changePopup()">
			<view class="popup-content-view-box">
				<view class="select-ctiy-popup-title">城市地区</view>
<!-- 				<view class="inputboxClass-popup">
					<image class="searchjing-image" src="@/static/search.png"></image>
					<input class="inputClass" @input="inputPhone_address" placeholder="请输入省份/城市"
						placeholder-class="address-search-pcs" />
				</view> -->
				<!-- <view class="popup-ctiy_item_box">
					<block v-for="(item,index) in popularCitiesData" :key="index">
						<view class="ctiy_item_box" @click="popularCitiesClick(item)">
							<text class="ctiy-item-text">{{item.name}}</text>
						</view>
					</block>
				</view> -->
				<view class="line-popup"></view>

				<view class="pcaPicker" @touchmove.stop.prevent="preventTouchMove">
					<view class="popBottom popRound">
						<picker-view :value="pcaIndex" @change="pcaChange">
							<picker-view-column>
								<block v-for="(item,index) in provinceData" :key="index">
									<view
										:class="pcaIndex[0]==index?'picker-view-item-text-select':'picker-view-item-text'">
										{{item.name}}
									</view>
								</block>
							</picker-view-column>
							<picker-view-column>
								<block v-for="(item,index) in provinceData[pcaIndex[0]].children" :key="index">
									<view
										:class="pcaIndex[1]==index?'picker-view-item-text-select':'picker-view-item-text'">
										{{item.name}}
									</view>
								</block>
							</picker-view-column>
						</picker-view>
					</view>
				</view>

				<view class="popup-btn-text" @click="confirm()">确定</view>
				<view class="height20"></view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import sortCar from "@/secondhandCar/sortCar/sortCar.vue";
	import {
		getBodyStructure,
		getEmissionStandard,
		getFuelType,
		getUsedCarList
	} from "@/api/secondhandCar.js"
	import {
		getProvinceList
	} from '@/api/base.js';
	import {
		popularCities,
	} from "@/api/logistics.js"
	export default {
		components: {
			sortCar
		},
		data() {
			return {
				toview: '',


				carPopupTitle: '轿车',
				temp: 1,
				textColor: '000000',
				//级别name
				levelName: '',
				//所在地name
				location1Name: '',
				//上牌地name
				location2Name: '',
				//里程name
				mileageName: '',
				//排放标准name
				criterionName: '',
				//然后类型 name
				fuelName: '',

				rangeMin: 0,
				rangMax: 10,
				rangeValue: [0, 10],
				number: 0,
				isLevelShow: true,
				islocation1Show: true,
				islocation2Show: true,
				ismileageShow: true,
				iscriterionhow: true,
				isfuelShow: true,
				isCarShow: 0,
				//级别数据集合
				levelDataList: [],
				//所在地
				location1DataList: [{
					title: '标题',
					name: '天津'
				}],
				//上牌地
				location2DataList: [{
					title: '标题',
					name: '天津'
				}],
				//里程数据集合
				mileageDataList: [
					{
						title: '标题',
						name: '不限'
					}, {
						title: '标题',
						name: '1万公里以内'
					}, {
						title: '标题',
						name: '3万公里以内'
					}, {
						title: '标题',
						name: '5万公里以内'
					}, {
						title: '标题',
						name: '8万公里以内'
					}, {
						title: '标题',
						name: '10万公里以内',
					}
				],
				//排放标准 数据集合
				criterionDataList: [],
				//燃油类型数据集合
				fuelDataList: [],
				scrollHeight: 0,
				selectedDataList: [],
				carList: [

					{
						title: '标题',
						name: '全部'
					}, {
						title: '标题',
						name: '微型车'
					}, {
						title: '标题',
						name: '小型车'
					}, {
						title: '标题',
						name: '紧凑型车'
					}, {
						title: '标题',
						name: '中型车'
					}, {
						title: '标题',
						name: '中大型车'
					}, {
						title: '标题',
						name: '大型车'
					}
				],
				SUVList: [

					{
						title: '标题',
						name: '全部'
					}, {
						title: '标题',
						name: '小型SUV'
					}, {
						title: '标题',
						name: '紧凑型SUV'
					}, {
						title: '标题',
						name: '中型SUV'
					}, {
						title: '标题',
						name: '中大型SUV'
					}, {
						title: '标题',
						name: '大型SUV'
					}
				],
				MPVList: [

					{
						title: '标题',
						name: '全部'
					}, {
						title: '标题',
						name: '小型MPV'
					}, {
						title: '标题',
						name: '紧凑型MPV'
					}, {
						title: '标题',
						name: '中型MPV'
					}, {
						title: '标题',
						name: '大型MPV'
					}
				],

				//城市选择弹窗相关
				pcaIndex: [0, 0],
				provinceData: [{
					children: {} //避免没有数据的时候一直报错找不到这个children
				}],
				popularCitiesData: [],
				islocation: 0,
				locationObj: {},
				locationObj2: {},
				/**
				 * 车源列表数据请求参数 start
				 * */
				postDataObj: {
					page: 1, //第几页数据
					page_num: 10, // 行数 必传 其他都是非必须
					order: 0, // 排序0：默认排序 1：最新上架 2：价格最低 3：价格最高 4：里程最少 5：车龄最短
					brand_id: '', //品牌id
					series_id: '', //二级车系id
					start_price: '', // 价格起 
					end_price: '', // 价格止
					start_car_age: '', // //车龄起  
					end_car_age: '', // 车龄止
					where_city_id: '', // 车辆所在地市id
					registration_city_id: '', // 上牌地市id
					structure_id: '', // 车身结构id
					standard_id: '', // 排放标准id
					fuel_type_id: '', // 燃油类型id
				},
				topList: [],
				addressObj: {
					"id": "",
					"parent_id": "0",
					"level": 1,
					"name": "全国",
					"children": [{
						"id": "",
						"parent_id": "",
						"level": 2,
						"name": "全国"
					}]
				}
			}
		},


		onLoad(option) {

			this.$utils.log(JSON.stringify(this.selectedDataList))
			var that = this
			if (this.selectedDataList.length > 0) {
				this.scrollHeight = uni.getSystemInfoSync().windowHeight - 110;
			} else {
				this.scrollHeight = uni.getSystemInfoSync().windowHeight - 50;
			}

			//结构
			getBodyStructure().then(res => {
				that.$utils.log("打印车结构数据列表  " + JSON.stringify(res))
				if (res.code == 0) {
					that.levelDataList = res.data
				}
			})
			//所在地 上牌地
			const valueAddress1 = uni.getStorageSync('address')
			this.$utils.log("打印valueAddress  " + JSON.stringify(valueAddress1))
			if (valueAddress1) {
				this.location1DataList[0].name = valueAddress1.name
			}
			const valueAddress2 = uni.getStorageSync('addressMore2')
			this.$utils.log("打印valueAddress  " + JSON.stringify(valueAddress2))
			if (valueAddress2) {
				this.location2DataList[0].name = valueAddress2.name
			}
			//里程

			//排放标准
			getEmissionStandard().then(res => {
				that.$utils.log("打印排放标准数据列表  " + JSON.stringify(res))
				if (res.code == 0) {
					that.criterionDataList = res.data
				}
			})
			//燃油类型
			getFuelType().then(res => {
				that.$utils.log("打印燃油类型数据列表  " + JSON.stringify(res))
				if (res.code == 0) {
					that.fuelDataList = res.data
				}
			})
			//请求省市数据
			getProvinceList().then(res => {
				var that = this
				// that.$utils.log("打印获取到的网络常用品牌 " + JSON.stringify(res))
				if (res.code == 0) {
					this.$nextTick(() => {
						that.provinceData = res.data
						that.provinceData.unshift(that.addressObj)
					})
				}
			})
			const value = uni.getStorageSync('login')
			// popularCities(value.id).then(res => {
			// 	that.$utils.log("打印城市热门常用    " + JSON.stringify(res))
			// 	this.$nextTick(() => {
			// 		that.popularCitiesData = res.data
			// 	})
			// })


			this.$utils.log("打印onload option " + JSON.stringify(option))
			// #ifdef H5
			let arr = option.selectedData.replace("\"([^\"]*)\"", "$1");
			let obj = option.postData.replace("\"([^\"]*)\"", "$1");
			this.selectedDataList = JSON.parse(arr);
			this.postDataObj = JSON.parse(obj);
			// #endif
			// #ifdef MP-QQ||MP-WEIXIN||APP-NVUE||APP-PLUS
			this.selectedDataList = JSON.parse(option.selectedData);
			this.postDataObj = JSON.parse(option.postData);
			// #endif
			if (this.postDataObj.where_city_name) {
				this.location1Name = this.postDataObj.where_city_name
			}
			this.$utils.log("打印传递过来的postData  " + JSON.stringify(this.postDataObj))
			if (this.selectedDataList.length > 0) {
				for (var i = 0; i < this.selectedDataList.length; i++) {

					if (this.selectedDataList[i].key == '1') {
						this.levelName = this.selectedDataList[i].name
						continue
					}

					if (this.selectedDataList[i].key == '2') {
						if (this.postDataObj.where_city_name) {
							this.location1Name = this.postDataObj.where_city_name
						} else {
							this.location1Name = this.selectedDataList[i].name.substring(3, this.selectedDataList[i].name
								.length + 1);
						}
						continue
					}

					if (this.selectedDataList[i].key == '3') {
						this.location2Name = this.selectedDataList[i].name.substring(3, this.selectedDataList[i].name
							.length + 1);
						continue
					}

					// if (this.selectedDataList[i].key == '4'){
					// 	this.mileageName = ''
					// }

					if (this.selectedDataList[i].key == '5') {
						this.criterionName = this.selectedDataList[i].name
						continue
					}

					if (this.selectedDataList[i].key == '6') {
						this.fuelName = this.selectedDataList[i].name
						continue
					}

				}

			}
			this.pageGetUsedCarList()
		},
		onShow() {
			this.$utils.stopPage() //禁止页面本身的滑动
		},
		/**
		 * onHide()触发的场景：
		 *导航页1>>导航页2，会触发导航页1  onHide（）
		 *
		 *导航页>>子页面，会触发导航页  onHide（）
		 *
		 *子页面1>>子页面2，会触发子页面1  onHide（）
		 **/
		onHide() {
			this.$utils.movePage()
		},
		/**
		 *onUnload()触发的场景：
		 *从子页面2返回到子页面1，会触发子页面2的onUnload()
		 *
		 *从子页面返回到导航页，会触发子页面的onUnload()
		 */
		onUnload() {
			this.$utils.movePage()
		},
		onReady() {
			setTimeout(() => {
				this.getNodesInfo()
			}, 2000)
		},
		methods: {
			getNodesInfo() {
				const query = uni.createSelectorQuery().in(this)
				query.selectAll('.more-view-right-title').boundingClientRect().exec(data => {
					console.log(data);
					let res = data[0];
					let rel = [];
					res.map(item => {
						rel.push(item.top - 60);
					});
					this.topList = rel;
				});
			},
			scrollLeftMore(e) {
				let scrollTop = e.target.scrollTop;
				for (let i = 0; i < this.topList.length; i++) {
					let h1 = this.topList[i];
					let h2 = this.topList[i + 1];
					if (scrollTop >= h1 && scrollTop < h2) {
						this.temp = i + 1;
					}
				}
			},

			//根据条件获取车列表数据
			pageGetUsedCarList() {
				var that = this
				getUsedCarList(this.postDataObj).then(res => {
					that.number = res.data.total
				})
			},
			maskClickpopup() {},
			changePopup() {},
			//城市选择弹窗相关方法 start
			// 防穿透
			preventTouchMove() {},
			// 滚动切换
			pcaChange(e) {
				this.$utils.log(JSON.stringify(e))
				const currentIndex = e.detail.value;

				if (currentIndex[0] != this.pcaIndex[0]) {
					this.pcaIndex.splice(0, 2, currentIndex[0], 0);
				}
				if (currentIndex[1] != this.pcaIndex[1]) {
					this.pcaIndex.splice(1, 2, currentIndex[1]);
				}
			},
			confirm() {
				if (this.islocation == 0) {
					this.location1DataList[0] = this.provinceData[this.pcaIndex[0]].children[this.pcaIndex[1]]
					this.citySelectLuojiFun(this.location1DataList[0])
				} else {
					this.location2DataList[0] = this.provinceData[this.pcaIndex[0]].children[this.pcaIndex[1]]
					this.citySelectLuojiFun(this.location2DataList[0])
				}
				this.$refs.select_ctiy_popup.close()
			},
			popularCitiesClick(item) {
				if (this.islocation == 0) {
					this.location1DataList[0] = item
					this.citySelectLuojiFun(item)
				} else {
					this.location2DataList[0] = item
					this.citySelectLuojiFun(item)
				}
				this.$refs.select_ctiy_popup.close()
			},
			citySelectLuojiFun(obj) {
				this.$utils.log("打印选择的城市  citySelectLuojiFun " + JSON.stringify(obj))
				if (this.islocation == 0) {
					this.location1Name = obj.name
					this.locationObj.id = obj.id
					this.locationObj.parent_id = obj.parent_id
					this.locationObj.name = '所在地' + obj.name
					this.locationObj.key = '2'
					uni.setStorageSync('addressMore1', obj)
					var bol = false
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '2') {
							bol = true
							this.selectedDataList[i] = this.locationObj
						}
					}
					if (!bol) {
						this.selectedDataList.push(this.locationObj)
					}
					this.postDataObj.where_city_id = obj.id
				} else {
					this.location2Name = obj.name
					this.locationObj2.id = obj.id
					this.locationObj2.parent_id = obj.parent_id
					this.locationObj2.name = '上牌地' + this.location2Name
					this.locationObj2.key = '3'
					uni.setStorageSync('addressMore2', obj)
					var bol = false
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '3') {
							bol = true
							this.selectedDataList[i] = this.locationObj2
						}
					}
					if (!bol) {
						this.selectedDataList.push(this.locationObj2)
					}
					this.postDataObj.registration_city_id = obj.id
				}
				this.pageGetUsedCarList()
				this.$utils.log("打印选择的城市  " + JSON.stringify(this.selectedDataList))
			},
			//城市选择弹窗相关方法 end
			format(val) {
				this.$utils.log("打印" + JSON.stringify(val))
				return val
			},
			sortItemtap1(item, index) {
				this.$utils.log(JSON.stringify(item) + "   index   " + index)
				if (this.levelName == item.name) {
					this.levelName = ''
					this.postDataObj.structure_id = ''
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].name == item.name) {
							this.selectedDataList.splice(i, 1)
						}
					}
				} else {
					item.key = '1'
					this.levelName = item.name
					var bol = false
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '1') {
							bol = true
							this.selectedDataList[i] = item
						}
					}
					if (!bol) {
						this.selectedDataList.push(item)
					}
					this.postDataObj.structure_id = item.id
				}
				this.pageGetUsedCarList()
				//dataList,index,bol,item
				// this.itemSelectedFunc(this.levelDataList,index,this.isLevelShow,item)

				//多选的方法
				// this.isLevelShow = false
				// this.$nextTick(() => {
				// 	if (this.levelDataList[index].isSelected) {
				// 		delete this.levelDataList[index].isSelected;
				// 		this.deleteSelectedDataListFunc(item.name)
				// 	} else {
				// 		this.levelDataList[index].isSelected = true
				// 	}
				// 	this.isLevelShow = true
				// })

				// if (index == 0) {
				// 	this.$refs.popup.open()
				// 	this.isCarShow = 0

				// } else if (index == 1) {
				// 	this.$refs.popup.open()
				// 	this.isCarShow = 1

				// } else if (index == 2) {
				// 	this.$refs.popup.open()
				// 	this.isCarShow = 2

				// }
			},

			//所在地
			sortItemtap2(item, index) {
				this.$utils.log(JSON.stringify(item) + "   index   " + index)
				if (this.location1Name == item.name) {
					this.location1Name = ''
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '2') {
							this.selectedDataList.splice(i, 1)
						}
					}
					this.postDataObj.where_city_id = ''
					this.pageGetUsedCarList()
				} else {
					this.islocation = 0
					this.$refs.select_ctiy_popup.open()
					// this.location1Name = item.name
					// this.selectedDataList.push(item)
				}

				// this.islocation1Show = false
				// this.$nextTick(() => {
				// 	if (this.location1DataList[index].isSelected) {
				// 		delete this.location1DataList[index].isSelected;
				// 		this.deleteSelectedDataListFunc(item.name)
				// 	} else {
				// 		this.location1DataList[index].isSelected = true
				// 	}
				// 	this.islocation1Show = true
				// })
			},
			//上牌地
			sortItemtap3(item, index) {
				this.$utils.log(JSON.stringify(item) + "   index   " + index)
				if (this.location2Name == item.name) {
					this.location2Name = ''
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '3') {
							this.selectedDataList.splice(i, 1)
						}
					}
					this.postDataObj.registration_city_id = ''
					this.pageGetUsedCarList()
				} else {
					this.islocation = 1
					this.$refs.select_ctiy_popup.open()

				}

				// this.islocation2Show = false
				// this.$nextTick(() => {
				// 	if (this.location2DataList[index].isSelected) {
				// 		delete this.location2DataList[index].isSelected;
				// 		this.deleteSelectedDataListFunc(item.name)
				// 	} else {
				// 		this.location2DataList[index].isSelected = true
				// 	}
				// 	this.islocation2Show = true
				// })
			},
			sortItemtap4(item, index) {
				this.$utils.log(JSON.stringify(item) + "   index   " + index)
				if (this.mileageName == item.name) {
					this.mileageName = ''
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].name == item.name) {
							this.selectedDataList.splice(i, 1)
						}
					}
				} else {
					item.key = '4'
					this.mileageName = item.name
					var bol = false
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '4') {
							bol = true
							this.selectedDataList[i] = item
						}
					}
					if (!bol) {
						this.selectedDataList.push(item)
					}
				}

				// this.ismileageShow = false
				// this.$nextTick(() => {
				// 	if (this.mileageDataList[index].isSelected) {
				// 		delete this.mileageDataList[index].isSelected;
				// 		this.deleteSelectedDataListFunc(item.name)
				// 	} else {
				// 		this.mileageDataList[index].isSelected = true
				// 	}
				// 	this.ismileageShow = true
				// })
			},
			sortItemtap5(item, index) {
				this.$utils.log(JSON.stringify(item) + "   index   " + index)
				if (this.criterionName == item.name) {
					this.criterionName = ''
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].name == item.name) {
							this.selectedDataList.splice(i, 1)
						}
					}
					this.postDataObj.standard_id = ''
				} else {
					item.key = '5'
					this.criterionName = item.name
					var bol = false
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '5') {
							bol = true
							this.selectedDataList[i] = item
						}
					}
					if (!bol) {
						this.selectedDataList.push(item)
					}
					this.postDataObj.standard_id = item.id
				}
				this.pageGetUsedCarList()
				// this.iscriterionhow = false
				// this.$nextTick(() => {
				// 	if (this.criterionDataList[index].isSelected) {
				// 		delete this.criterionDataList[index].isSelected;
				// 		this.deleteSelectedDataListFunc(item.name)
				// 	} else {
				// 		this.criterionDataList[index].isSelected = true
				// 	}
				// 	this.iscriterionhow = true
				// })
			},
			sortItemtap6(item, index) {
				this.$utils.log(JSON.stringify(item) + "   index   " + index)
				if (this.fuelName == item.name) {
					this.fuelName = ''
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].name == item.name) {
							this.selectedDataList.splice(i, 1)
						}
					}
					this.postDataObj.fuel_type_id = ''
				} else {
					item.key = '6'
					this.fuelName = item.name
					var bol = false
					for (var i = 0; i < this.selectedDataList.length; i++) {
						if (this.selectedDataList[i].key == '6') {
							bol = true
							this.selectedDataList[i] = item
						}
					}
					if (!bol) {
						this.selectedDataList.push(item)
					}
					this.postDataObj.fuel_type_id = item.id
				}
				this.pageGetUsedCarList()
				//多选
				// this.isfuelShow = false
				// this.$nextTick(() => {
				// 	if (this.fuelDataList[index].isSelected) {
				// 		delete this.fuelDataList[index].isSelected;
				// 		this.deleteSelectedDataListFunc(item.name)
				// 	} else {
				// 		this.fuelDataList[index].isSelected = true
				// 	}
				// 	this.isfuelShow = true
				// })
			},
			selectedClick(inta) {
				this.temp = inta
				this.toview = 'idto' + inta
			},
			moveClick(item, index) {
				this.selectedDataList.splice(index, 1)
				if (item.key == '1')
					this.levelName = ''
				this.postDataObj.structure_id = ''
				if (item.key == '2')
					this.location1Name = ''
				this.postDataObj.where_city_id = ''
				if (item.key == '3')
					this.location2Name = ''
				this.postDataObj.registration_city_id = ''
				if (item.key == '4')
					this.mileageName = ''
				if (item.key == '5')
					this.criterionName = ''
				this.postDataObj.standard_id = '' // 排放标准id
				if (item.key == '6')
					this.fuelName = ''
				this.postDataObj.fuel_type_id = ''

				this.pageGetUsedCarList()
			},
			foot_btnClick() {
				if (this.number > 0) {
					// 获取当前页上的栈（数组形式）
					var pages = getCurrentPages()
					//上一页面 
					var prevPage = pages[pages.length - 2]
					var object = {
						'selectedDataList': this.selectedDataList
					}
					object.key = 'more'
					prevPage.$vm.backData(object) /// backData为A页面定义好的一个方法 调用该方法obj数据会返回到A页面backData方法中
					// 返回上一页
					uni.navigateBack()
				} else {
					uni.showToast({
						title: '没有车辆符合',
						icon: 'none'
					})
				}

			},
			//删除头部选择了数据
			deleteSelectedDataListFunc(name) {
				for (var i = 0; i < this.selectedDataList.length; i++) {
					if (this.selectedDataList[i].name == name) {
						this.selectedDataList.splice(i, 1);
						i--;
					}
				}
			},
			itemSelectedFunc(dataList, index, bol, item) {
				bol = false
				this.$nextTick(() => {
					if (dataList[index].isSelected) {
						delete dataList[index].isSelected;
						this.deleteSelectedDataListFunc(item.name)
					} else {
						dataList[index].isSelected = true
					}
					bol = true
				})
			},
			closePopup() {
				this.$refs.popup.close()
			}
		}
	}
</script>

<style>
	.page-wraper {
		height: 100%;
		background-color: #fff;
	}

	.selected-header-box {
		height: 100rpx;
		white-space: nowrap;
		position: relative;
	}

	.scroll-view-class {
		white-space: nowrap; // 滚动必须加的属性
		width: 100%;
		height: 120rpx;
		padding-left: 20rpx;
	}

	.header_item_box {
		display: inline-flex; // item的外层定义成行内元素才可进行滚动 inline-block / inline-flex 均可
		flex-direction: row;
		align-items: center;
		background-color: #ECF1FF;
		justify-content: center;
		margin: 20rpx 12rpx 20rpx 0rpx;
		padding: 10rpx 30rpx;
		border-radius: 50rpx;
	}

	.header-item-image {
		width: 19.01rpx;
		height: 19rpx;
		margin-left: 8rpx;
	}



	.more-view-box {
		display: flex;
		flex-direction: row;
		height: 100%;
	}

	.more-view-left {
		flex: 2;
		background-color: #F8F9FD;
		height: 100vh;
	}

	.left-item-box {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 0rpx;
	}

	.left-item-image {
		flex: 2;
		text-align: right;
		padding-right: 5rpx;
	}

	.left-iamge-round {
		width: 18rpx;
		height: 18rpx;
	}

	.left-item-text {
		flex: 5;
		text-align: left;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #666666;
		opacity: 1;

	}

	.left-item-text-selected {
		flex: 5;
		text-align: left;

		font-size: 30rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #0E59EA;
		opacity: 1;
	}

	.more-view-right {
		flex: 5;
	}

	.more-view-right-title {
		margin: 20rpx 0rpx 10rpx 20rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #1C2125;
		opacity: 1;
	}



	.foot-view-class {
		width: 100%;
		height: 150rpx;
	}

	.foot-view-btn {
		/* 不放大不缩小固定100rpx */
		background-color: #4E6ECC;
		text-align: center;
		color: white;
		font-weight: bolder;
	}

	.foot-view {
		position: fixed;
		bottom: 0;
		height: 100rpx;
		width: 94%;
		padding: 3%;
		background-color: white;
		z-index: 50;
	}

	.popup-view-Recommend {
		height: 100%;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.popup_box {
		background-color: white;
		width: 100%;
		padding: 20rpx;
	}

	.popup-title-box {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		margin-bottom: 10rpx;
	}

	.popup-title-text {
		flex: 1;
		font-size: 36rpx;
		font-weight: bold;
		text-align: center;
		color: black;
	}

	.popup-image-close {
		width: 40rpx;
		height: 40rpx;
		text-align: left;
	}

	.popup-btn-view {
		width: 96%;
		margin: 2%;
		background-color: #4E6ECC;
		border-radius: 20rpx;
		text-align: center;
		padding: 20rpx 0rpx;
	}

	.header-selected-view-class {
		font-size: 24rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #0E59EA;
	}

	/**
	 * 此处为popup css相关  -----start
	 **/
	.popup-content-view-box {
		width: 750rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 28rpx 28rpx 0rpx 0rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		/* 设置绝对定位 */
		position: absolute;
		/* 距离父元素上边缘  */
		bottom: -20rpx;
		z-index: 1;
		text-align: center;
	}

	.select-ctiy-popup-title {
		font-size: 32rpx;
		font-family: Alimama ShuHeiTi;
		font-weight: bold;
		color: #1C2125;
		margin-top: 60rpx;
	}

	.inputboxClass-popup {
		width: 694rpx;
		height: 72rpx;
		background: #F3F6FE;
		border: 1px solid #FFFFFF;
		border-radius: 36rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-bottom: 18rpx;
		margin-top: 18rpx;
		text-align: left;
	}

	.searchjing-image {
		width: 30rpx;
		height: 30rpx;
		margin-left: 32rpx;
	}

	.scroll-view-class-city-popup {
		white-space: nowrap; // 滚动必须加的属性
		width: 100%;
		height: auto;
		padding-left: 20rpx;
	}

	/* .header_item_box {
		display: inline-flex; // item的外层定义成行内元素才可进行滚动 inline-block / inline-flex 均可
		flex-direction: row;
		align-items: center;
		background-color: #ECF1FF;
		justify-content: center;
		margin: 20rpx 12rpx 20rpx 0rpx;
		padding: 10rpx 30rpx;
		border-radius: 50rpx;
	} */
	.popup-ctiy_item_box {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		padding-left: 30rpx;
	}

	.ctiy_item_box {
		border: 2px solid #00000009;
		border-radius: 14rpx;
		margin: 20rpx 12rpx 20rpx 0rpx;
		padding: 10rpx 30rpx;
	}

	.ctiy-item-text {
		font-size: 24rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #333333;
		opacity: 1;
	}

	.height20 {
		height: 120rpx;
	}

	.line-popup {
		width: 100%;
		height: 14rpx;
		background: #F3F6FE;
		border-radius: 0rpx;
		margin-top: 20rpx;
	}

	.popup-btn-text {
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #FFFFFF;
		opacity: 1;

		width: 654rpx;
		height: 94rpx;
		background: #0E59EA;
		opacity: 1;
		border-radius: 14rpx;
		text-align: center;
		line-height: 94rpx;
		margin-top: 48rpx;
		margin-bottom: 30rpx;
	}

	picker-view {
		height: 300rpx;
	}

	.picker-view-item-text-select {
		text-align: center;
		line-height: 68rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #0E59EA;
		opacity: 1;
	}

	.picker-view-item-text {
		text-align: center;
		line-height: 68rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		opacity: 1;
	}

	.pcaPicker {
		height: 300rpx;
		width: 100%;
		background-color: #999999;
	}

	.pcaPicker>.popBottom {
		width: 100%;
		background-color: #ffffff;
		transition: all 0.3s ease;
		transform: translateY(100%);
	}

	.pcaPicker>.popRound {
		transition: all 0.3s ease;
		transform: translateX(0);
		opacity: 1;
	}

	.address-search-pcs {
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #999999;
		opacity: 1;
		margin-left: 12rpx;
		background-color: #FFFFFF00;
	}

	.inputClass {
		flex: 1;
		padding: 0rpx;
		height: 72rpx;

		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		opacity: 1;
		margin-left: 12rpx;
	}

	/**
	 * 此处为popup css 相关  -----end
	 **/
</style>